@import "@/common/constants/StyleConst.scss";

.InvoiceDetails-Container {
  height: 100%;
  box-shadow: 0px 8px 24px rgba(0, 0, 0, 0.25) !important;
  overflow-y: hidden;

  .header {
    color: $color-text-white;

    .v-toolbar__title {
      font-size: 14px;
      font-weight: 700;
    }

    .icon-btn {
      .v-icon {
        font-size: 16px;
      }
    }
  }

  .details-content {
    height: calc(100% - 40px);
    overflow-y: scroll;
    overflow-y: overlay;

    .basic-content {
      .line {
        padding-bottom: 0;
        margin-bottom: 16px;
      }

      .jobCate :deep {
        border: 2px solid $color-theme-orange;

        .v-toolbar__content {
          border-bottom: 2px solid $color-theme-orange;

          .v-toolbar__title {
            font-size: 14px;
            font-weight: bold;
          }
        }

        .v-list {
          height: calc(100% - 50px);
          overflow-y: scroll;
          overflow-y: overlay;

          .v-list-item {
            min-height: 36px;
            height: 36px;
            border-bottom: 2px solid $color-theme-lightgrey;

            .v-list-item__action {
              margin: 0;
              margin-right: 32px;
            }
          }
        }
      }
    }

    .nav {
      width: 100%;

      .v-btn {
        padding: 0 32px;
        color: #3B4765;
        font-weight: 700;
        text-transform: unset;
      }

      .active-btn {
        background-color: #79839B !important;
        color: $color-text-white;
      }
    }

    .invoice-window :deep {
      height: calc(100% - 333px);

      .v-window__container,
      .v-window-item {
        height: 100%;
      }
    }
  }
}